import React from 'react';

import { signInSocial } from '@/entities/auth/model/actions';
import { useAppDispatch } from '@/shared/store';
import { Wrapper } from '@/shared/ui';
import { Header } from '@/widgets/Header';
import { useRouter } from 'next/router';

import { About } from './ui/About';
import { Capability } from './ui/Capability';
import { Contact } from './ui/Contact';
import { FooterParallax } from './ui/FooterParallax';
import { Main } from './ui/Main';
import { QA } from './ui/QA';
import { Target } from './ui/Target';

export const MainPage = () => {
  const router = useRouter();
  const dispatch = useAppDispatch();
  const { code } = router.query;

  React.useEffect(() => {
    if (code) {
      dispatch(signInSocial(code as string)).then(() => {
        router.push('/').then(() => {
          router.reload();
        });
      });
    }
  }, [code]);
  return (
    <>
      <Header />
      <Wrapper>
        <Main />
        <About />
        <Capability />
        <Target />
        <QA />
        <Contact />
      </Wrapper>
      <FooterParallax />
    </>
  );
};
